<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <style type="text/css">
        @import url("css/amapBox.css");
    </style>
    <style type="text/css">
        @import url("css/aroundbox.css");
    </style>
    <style type="text/css">
        @import url("css/banche.css");
    </style>
    <style type="text/css">
        @import url("css/loginbox.css");
    </style>
    <style type="text/css">
        @import url("css/search.css");
    </style>
    <style type="text/css">
        @import url("css/route_info.css");
    </style>
    <title>路径展示</title>
    <link rel="icon" href="img/logo.png" sizes="32x32">
    <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css"/>
    <script
            src="https://webapi.amap.com/maps?v=1.4.15&key=c211f8a2ee6ac8f23e228ac4d02637d4&plugin=AMap.PolyEditor"></script>
    <script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
</head>

<body>
<div id="dirBox" class="filtercanvas lujingguihua">
    <div id="planForm">
        <!--<i class="dir_close iconfont icon-close" data-spm-anchor-id="0.0.0.i2.42e51c4eEIOYbj"></i>-->
        <div class="line-search">
            <!-- <div class="line-search-left icon_exchange" id="dir_exchange">
                <i class="iconfont icon-switchroute"></i>
            </div> -->
            <div class="line-search-form">
                <p class="line_serch_ipt line-search-from">
                    <label>起 </label>
                    <input type="text" class="dir_ipt" id="dir_from_ipt" dirtype="from" placeholder="请输入起点" value=""
                           autocomplete="off" data-spm-anchor-id="0.0.0.i8.42e51c4eEIOYbj">
                    <span class="del-item" style="display: none;"></span>
                </p>
                <div class="passList"></div>
                <p class="line_serch_ipt line-search-to">
                    <label>终 </label>
                    <input type="text" class="dir_ipt" id="dir_to_ipt" dirtype="to" placeholder="请输入终点" value=""
                           autocomplete="off">
                    <span class="del-item" style="display: none;"></span>
                </p>
                <!-- <p class="line_serch_ipt line-search-to">
                    <label>终 </label>
                    <input type="text" class="dir_ipt" id="dir_to_ipt" dirtype="to" placeholder="请输入终点" value="" autocomplete="off">
                    <span class="del-item" style="display: none;"></span>
                    <select class="form-control">
                        <option>出发时间</option>
                        <option>到达时间</option>
                    </select>
                </p> -->
                <div class="time-select">
                    <!-- <label>时 </label> -->
                    <input type="text" class="form-control form-control-input startDate hasDatepicker"
                           id="dp1579509382743" placeholder="请输入时间" value="" autocomplete="off">
                    <select class="form-control">
                        <option>出发时间</option>
                        <option>到达时间</option>
                    </select>
                </div>
                <p class="line-search-submit">

                    <!--<a href="javascript:void(0)" class="line-search-clear none">清除路线</a>-->
                    <a href="javascript:void(0)" class="dir_submit"
                       onclick="hello(document.getElementById('dir_from_ipt').value, document.getElementById('dir_to_ipt').value)">查询</a>
                    <span class="fa-spin"></span>
                </p>
            </div>
            <!--<a href="javascript:void(0)" class="line-search-right icon_add" id="via_add"></a>-->
        </div>
    </div>
</div>
<div id="routeBox">
    <div id="routeInfo">
        <div class="amap-lib-transfer">
            <div class="planTitle" index="0">
                <h3><span class="line busline "><span class="beforespan"></span><span
                        class="afterspan"></span>Y10路</span><span class="line busline "><span class="beforespan"></span><span
                        class="afterspan"></span>班车</span></h3>
                <p>2小时04分钟(40.41公里) | 预计到达时间：<span class="red">2020-01-20 08:43:00</span></p>
                <div class="sidebar">
                    <div class="icon-arrow-up expand" href="javascript:void(0)"><span class="aftera"></span></div>
                </div>
            </div>
            <dl class="plan" style="display: block;">
                <dt class="busstop start" index="start">
                    <div class="beforedt"></div>
                    <div class="afterdt"></div>
                    延庆汽车站
                </dt>
                <dt class="bus-route walk" index="0">
                    <div class="beforedt"></div>
                    <div class="afterdt"></div>
                    步行630米到达恒生市场
                </dt>
                <dt class="bus-route bus " index="1">
                    <div class="beforedt"></div>
                    <div class="afterdt"></div>
                    Y10路(外环)(京张路口东--日上东门)
                </dt>
                <dd class="bus ">
                    <div class="afterdd"></div>
                    <h4><a href="javascript:void(0)" class="busstop" id="">恒生市场</a> <span>上车</span></h4>
                    <ul>
                        <li>虹桥北路</li>
                    </ul>
                    <h4><a href="javascript:void(0)" class="busstop" id="">瑞安居小区西门</a> <span>下车</span></h4>
                    <p>首:06:00 末:22:00 </p><a href="javascript:void(0)" style="cursor: pointer" class="icon-arrow"><span
                        class="aftera"></span>10站</a>
                </dd>
                <dt class="bus-route walk" index="2">
                    <div class="beforedt"></div>
                    <div class="afterdt"></div>
                    步行5.86公里到达阪泉服务中心
                </dt>
                <dt class="subway-route subway " index="3">
                    <div class="beforedt"></div>
                    <div class="afterdt"></div>
                    班车(阪泉服务中心--集散广场)
                </dt>
                <dd class="subway ">
                    <div class="afterdd"></div>
                    <h4><a href="javascript:void(0)" class="busstop" id="">阪泉服务中心</a> <span>上车</span></h4>
                    <ul>
                        <li>塘下路口</li>
                    </ul>
                    <h4><a href="javascript:void(0)" class="busstop" id="">集散广场</a> <span>下车</span></h4>
                    <p>发车时间:08:00 到达时间:08:43</p>
                </dd>
                <dt class="bus-route walk" index="4">
                    <div class="beforedt"></div>
                    <div class="afterdt"></div>
                    步行156米到达国家高山滑雪中心
                </dt>
                <dt class="busstop end" index="end">
                    <div class="beforedt"></div>
                    <div class="afterdt"></div>
                    国家高山滑雪中心
                </dt>
            </dl>
        </div>
    </div>
</div>
<div id="container"></div>
<script src="http://lib.sinaapp.com/js/jquery/1.6/jquery.min.js"></script>
<script type="text/javascript" src="src/road.js"></script>
<script type="text/javascript" src="src/getRoute.js"></script>
<script type="text/javascript"
        src="https://webapi.amap.com/maps?v=1.4.15&key=c211f8a2ee6ac8f23e228ac4d02637d4"></script>
<script type="text/javascript">
    // 创建地图实例
    var map = new AMap.Map("container", {
        center: [115.846889, 40.469926],
        zoom: 14,
        mapStyle: "amap://styles/darkblue"
    });

    var btn = document.getElementById("btn");

    function hello(i, j) {
        console.log(i);
        console.log(j);
    }

    // 第一种 通过点击事件

    // btn.onclick = function(){
    //     alert("这是第一种点击方式");
    // }
    // var map = new AMap.Map('container', {
    //   resizeEnable: true, //是否监控地图容器尺寸变化
    //   mapStyle: "amap://styles/darkblue"
    // });
    //var polyline = getRegularBusRoute(bqfwq_to_gshx, '#0000FF');
    var walkbus = getBus("115.985279,40.46178", "115.926297,40.488696");
    //var walkbus = getBus("115.813198,40.439105", "115.820826,40.463101");
    //115.820826,40.463101
    // console.log(walkbus);
    // console.log(walkbus.length);
    var polyline = getRoute(walkbus);
    //var polyline = [];
    polyline.push(getRegularBusRoute(bqfwq_to_gshx, "#DAA520"))
    //polyline.push(getRegularBusRoute(syhq_to_bqfwq, "#8B0000"))
    //polyline.push(getRegularBusRoute(yqdjc_to_jsgc, "#DAA520"))
    //polyline.push(getRegularBusRoute(jzgt, "#DAA520"))
    //polyline.push(getRegularBusRoute(baikanglu, "#008B8B"))
    //polyline.push(getRegularBusRoute(syhq_to_bqfwq, "#808000"));
    map.add(polyline)
    map.setFitView(polyline)
</script>
</body>

</html>